<script>
import { defineComponent, ref } from 'vue'
import { ElMessage } from 'element-plus'
export default defineComponent({
    setup() {
        const formType=ref('')
        const form = ref({
            name: '',
            region: [{
                value:'Option1',
                label:'Bug'
                },{
                value:'Option2',
                  label:'Device'  
                },{
                value:'Option3',
                    label:'Other'
                }
        ],
            date1: '',
            date2: '',
            delivery: false,
            type: [],
            resource: '',
            desc: '',
            formType,
            })
            const onSubmit=()=>{
                ElMessage({
                    showClose: true,
                    message: '申报成功 ^.^',
                    type: 'success',
                })
                
            }
            return{form,onSubmit}
    },
})

</script>

<template>
    <div>
        <el-form :model="form" label-width="120px">
    <el-form-item label="申报人姓名">
      <el-input v-model="form.name" />
    </el-form-item>
    <el-form-item label="申报类型">
      <el-select v-model="formType" placeholder="please select your zone">
        <el-option v-for="item in form.region"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"/>
      </el-select>
    </el-form-item>
    <el-form-item label="申报时间">
      <el-col :span="11">
        <el-date-picker
          v-model="form.date1"
          type="date"
          placeholder="Pick a date"
          style="width: 100%"
        />
      </el-col>
      <el-col :span="2" class="text-center">
        <span class="text-gray-500">-</span>
      </el-col>
      <el-col :span="11">
        <el-time-picker
          v-model="form.date2"
          placeholder="Pick a time"
          style="width: 100%"
        />
      </el-col>
    </el-form-item>
    
    <el-form-item label="申报内容">
      <el-input v-model="form.desc" type="textarea" />
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="onSubmit">Create</el-button>
      <el-button>Cancel</el-button>
    </el-form-item>
  </el-form>
    </div>
</template>

<style scoped>
</style>
